<!DOCTYPE html>
<html class="x-admin-sm">
{include file='public/header'}
<link rel="stylesheet" href="/admin/xadmin/lib/layui/css/inputTag.css">
<script src="/admin/xadmin/lib/layui/upload.js" charset="utf-8"></script>
<script type="text/javascript" src="/admin/xadmin/lib/layui/inputTag.js" charset="utf-8"></script>
<body>
<div class="x-body">
    <form class="layui-form" lay-filter="formAjax">
        <div class="layui-form-item">
            <label class="layui-form-label">
                订单号
            </label>
            <div class="layui-input-block">
                <input type="text" id="order_no" autocomplete="off" class="layui-input" value="" readonly />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class="x-red">*</span>退款方式
            </label>
            <div id="refundType" style="width:100%;flex:1"></div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                订单金额
            </label>
            <div class="layui-input-block">
                <input type="text" id="total_fee" autocomplete="off" class="layui-input" value="" readonly />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                会员
            </label>
            <div class="layui-input-block">
                <input type="text" id="type_text" autocomplete="off" class="layui-input" value="" readonly />
            </div>
        </div>
        <div class="layui-form-item" id="remain_money_div">
            <label class="layui-form-label">
                会员到期时间
            </label>
            <div class="layui-input-block">
                <input type="text" id="expiration_time_text" autocomplete="off" class="layui-input" value="" readonly />
            </div>
        </div>
        <div class="layui-form-item" id="remain_month_div">
            <label class="layui-form-label">
                会员剩余天数
            </label>
            <div class="layui-input-block">
                <input type="text" id="remain_days" autocomplete="off" class="layui-input" value="" readonly />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                退款金额
            </label>
            <div class="layui-input-block">
                <input type="text" id="refund_money" placeholder="退款金额" readonly
                       lay-verify="required" autocomplete="off" class="layui-input" value="" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class="x-red">*</span>退款原因
            </label>
            <div class="layui-input-block">
                    <textarea type="text" name="refund_reason" id="refund_reason" placeholder="退款原因" required="required"
                              lay-verify="required" autocomplete="off" class="layui-textarea" value=""></textarea>
            </div>
        </div>
        <input type="hidden" name="id" id="id" value="" />
        <button id="submitData" class="layui-btn" lay-submit lay-filter="submitData" style="display: none;" />

    </form>
</div>
<script>
    let params = {
        editUrl: '/admin/record/orderRefund',
        detailUrl: '/admin/record/orderDetail',
        refundMoneyUrl: '/admin/record/refundMoney',
        confirm:true
    }
    form_ajax(params)
    let id = GetQueryString('id')
    $('#id').val(id);
    let selectParams = {
        url: '/admin/record/selectRefundType',
        selected: [],
        tips: '退款方式',
        name: 'refund_type',
        field_id: 'key',
        field_Name: 'value',
        elem: '#refundType',
        verify:'required'
    }
    selectN(selectParams)

    Ajax(params.detailUrl, { id }).then(result => {
        $('#order_no').val(result.data.order_no);
        $('#total_fee').val(result.data.total_fee);
        $('#type_text').val(result.data.type_text);
        $('#expiration_time_text').val(result.data.expiration_time_text);
        $('#remain_days').val(result.data.remain_days);
    });

    function infoSelectN(option,value){
        if (option.elem === '#refundType'){
            //显示退款金额
            Ajax(params.refundMoneyUrl, { id:id,refund_type:value}).then(result => {
                $('#refund_money').val(result.data.refund_money);
            });
            if (value === 'part'){
                $('#remain_month_div').show();
            }else if(value === 'all'){
                $('#remain_month_div').hide();
            }
        }
    }
</script>
</body>

</html>